import { useUserStore } from "@/stores/user";
import type { Directive,DirectiveBinding } from "vue";

export const myColor:Directive={
    mounted(el:HTMLElement,binding:DirectiveBinding<string>){
        console.log(el,binding);
        el.style.color=binding.value
    },
    updated(el:HTMLElement,binding:DirectiveBinding<string>){
        el.style.color=binding.value
    }
}

const adminPerms='*:*:*'

const setAuth=(el:HTMLElement,binding:DirectiveBinding<string>)=>{
    const store=useUserStore()
    const perms=store.profile.permissions
    if(perms.includes(adminPerms)){
        return
    }
    if(!perms.includes(binding.value)){
        el.remove()
    }
}
export const auth:Directive={
    mounted:setAuth,
    updated:setAuth
}